﻿<phone:PhoneApplicationPage 
    x:Class="CanalDeNoticiasMSDNv4.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
    xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="800" 
    d:DataContext="{d:DesignData SampleData/MainViewModelSampleData.xaml}"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait"  Orientation="Portrait"
    shell:SystemTray.IsVisible="False"
    xmlns:local="clr-namespace:CanalDeNoticiasMSDNv4"
    >
	<phone:PhoneApplicationPage.Resources>
        <Style x:Key="ButtonStyle1" TargetType="Button">
			<Setter Property="Background" Value="Transparent"/>
			<Setter Property="BorderBrush" Value="{StaticResource PhoneForegroundBrush}"/>
			<Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/>
			<Setter Property="BorderThickness" Value="0"/>
			<Setter Property="FontFamily" Value="{StaticResource PhoneFontFamilySemiBold}"/>
			<Setter Property="FontSize" Value="{StaticResource PhoneFontSizeMediumLarge}"/>
			<Setter Property="Padding" Value="0"/>
            <Setter Property="HorizontalContentAlignment" Value="Left"/>
            <Setter Property="Margin" Value="-10"/>
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="Button">
						<Grid Background="Transparent">
							<VisualStateManager.VisualStateGroups>
								<VisualStateGroup x:Name="CommonStates">
									<VisualState x:Name="Normal"/>
									<VisualState x:Name="MouseOver"/>
									<VisualState x:Name="Pressed">
										<Storyboard>
											<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer">
												<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneBackgroundBrush}"/>
											</ObjectAnimationUsingKeyFrames>
											<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ButtonBackground">
												<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneForegroundBrush}"/>
											</ObjectAnimationUsingKeyFrames>
										</Storyboard>
									</VisualState>
									<VisualState x:Name="Disabled">
										<Storyboard>
											<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer">
												<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/>
											</ObjectAnimationUsingKeyFrames>
											<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ButtonBackground">
												<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/>
											</ObjectAnimationUsingKeyFrames>
										</Storyboard>
									</VisualState>
								</VisualStateGroup>
							</VisualStateManager.VisualStateGroups>
							<Border x:Name="ButtonBackground" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="0" Margin="{StaticResource PhoneTouchTargetOverhang}" Background="{StaticResource TransparentBrush}">
								<ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
							</Border>
						</Grid>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
		</Style>
	</phone:PhoneApplicationPage.Resources>

    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid local:TiltEffect.IsTiltEnabled="True" 
          x:Name="LayoutRoot" Background="Transparent">        
        <!--Panorama control-->
        <controls:Panorama Title="MSDN España" >
            <controls:Panorama.Background>
                <ImageBrush ImageSource="PanoramaBackground.png"/>
            </controls:Panorama.Background>
            <!--Panorama item one-->
            <controls:PanoramaItem>
                <ScrollViewer Margin="0,-25,0,0">
                    <StackPanel Margin="0,0,-12,0" >
                        <TextBlock Text="Vídeos" 
                                   Style="{StaticResource PhoneTextTitle1Style}" Height="119" />
                        <ItemsControl ItemsSource="{Binding Videos}" 
                                      Margin="0,0,0,0">
                            <ItemsControl.ItemTemplate>
                                <DataTemplate>
                                    <Button Style="{StaticResource ButtonStyle1}" 
                                            Click="Button_Click" >
                                        <StackPanel Orientation="Horizontal">
                                            <Image Height="100" Width="100" 
                                                   Source="{Binding Thumbnail}" Margin="12,0,9,0"/>
                                            <StackPanel Width="265" VerticalAlignment="Center">
                                                <TextBlock Text="{Binding Title}" TextWrapping="Wrap"
                                                       Style="{StaticResource PhoneTextTitle3Style}"/>
                                            </StackPanel>
                                        </StackPanel>
                                    </Button>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </StackPanel>
                </ScrollViewer>
            </controls:PanoramaItem>
 
            <!--Panorama item two-->
            <controls:PanoramaItem>
                <ScrollViewer Margin="0,-25,0,0">
                    <StackPanel Margin="0,0,-12,0" >
                        <TextBlock Text="Artículos"
                                   Style="{StaticResource PhoneTextTitle1Style}" Height="119" />
                        <ItemsControl ItemsSource="{Binding Articulos}" 
                                      Margin="0,0,0,0">
                            <ItemsControl.ItemTemplate>
                                <DataTemplate>
                                    <Button 
                                            Style="{StaticResource ButtonStyle1}"
                                            Click="Button_Click" >
                                        <StackPanel Margin="0,0,0,5">
                                            <TextBlock Text="{Binding Title}" 
                                               TextWrapping="Wrap" 
                                               Style="{StaticResource PhoneTextTitle2Style}"/>
                                            <TextBlock Text="{Binding PubDate}" Style="{StaticResource PhoneTextSubtleStyle}"/>
                                        </StackPanel>
                                    </Button>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </StackPanel>
                </ScrollViewer>
            </controls:PanoramaItem>

            <controls:PanoramaItem>
                <ScrollViewer Margin="0,-25,0,0">
                    <StackPanel Margin="0,0,-12,0" >
                        <TextBlock Text="Noticias" 
                                   Style="{StaticResource PhoneTextTitle1Style}" Height="119" />
                        <ItemsControl ItemsSource="{Binding Noticias}" 
                                      Margin="0,0,0,0">
                            <ItemsControl.ItemTemplate>
                                <DataTemplate>
                                    <Button Style="{StaticResource ButtonStyle1}" 
                                            Click="Button_Click" >
                                        <StackPanel Margin="0,0,0,17">
                                            <TextBlock Text="{Binding Title}" 
                                               TextWrapping="Wrap" 
                                               Style="{StaticResource PhoneTextTitle2Style}"/>
                                            <TextBlock Text="{Binding PubDate}" Style="{StaticResource PhoneTextSubtleStyle}"/>
                                        </StackPanel>
                                    </Button>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </StackPanel>
                </ScrollViewer>
            </controls:PanoramaItem>
        </controls:Panorama>
        <StackPanel  x:Name="progressPanel" Orientation="Horizontal" 
                    Margin="0,0,0,775" Visibility="Collapsed"
                    Background="#81000000">
            <TextBlock Text="Cargando datos..." Style="{StaticResource PhoneTextSmallStyle}" />
            <toolkit:PerformanceProgressBar VerticalAlignment="Center"  
                  Name="progressBar"
                  Foreground="{StaticResource PhoneForegroundBrush}"
                  Width="300" IsIndeterminate="True" />
        </StackPanel>
    </Grid>
 
    <!--Panorama-based applications should not show an ApplicationBar-->

</phone:PhoneApplicationPage>